<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/jsp/comm_css_include.jsp"%>
<!-- zTreeStyle.css -->
<link rel="stylesheet" type="text/css" href="${basePath}/css/zTreeStyle/zTreeStyle/zTreeStyle.css">
<!doctype html>
<html>
<head>
	<style type="text/css">
	   .gray-bg
	   {
	     background-color: #fff;
	   }
	</style>
</head>
<body class="gray-bg">
	 <div class="ibox-content">
		<form class="form-horizontal m-t" id="commentForm">
			<table cellpadding="0" cellspacing="0" border="0" bordercolor="#3B95C8"  width="100%" class="tablefont">
				<tr>
				    <td width="50%" align="right">
				    	<label class="col-sm-3 control-label np">职位编号：</label>
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<input id="positionId" name="positionId" minlength="1" maxlength="64" type="text" class="form-control" aria-required="true" placeholder="请输入职位编号" >
		    				</div>
	    				</div>
					</td>
				    <td width="50%" align="right">
				    	<label class="col-sm-3 control-label np">用户名称：</label>
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<input id="id" name="id" type="hidden"/>
		    					<input id="loginName" name="loginName" minlength="2" maxlength="20" type="text" class="form-control" readonly="readonly" required="required" rearia-required="true" placeholder="请输入用户名称(必填)" >
		    				</div>
	    				</div>
					</td>
				</tr>
				
				<tr>
				    <td width="50%" align="right">
				    	<label class="col-sm-3 control-label np">用户姓名：</label>
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<input id="uname" name="uname" minlength="2" maxlength="20" type="text" class="form-control" aria-required="true" required="required" readonly="readonly" placeholder="请输入用户姓名(必填)" >
		    				</div>
	    				</div>
					</td>
					 <td width="50%" align="right">
				    	<label class="col-sm-3 control-label np">贷款银行：</label>
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<input id="loanBank" name="loanBank" type="hidden"   />
		    					<input id="loanBankName" name="loanBankName" type="text" class="form-control smalliconcur smallicon" readonly="readonly"  onclick="loanBankCho()" placeholder="贷款银行 " >
		    				</div>
	    				</div>
					</td>
				</tr>
				
				<tr>		
				    <td width="50%" align="right">
				    	<label class="col-sm-3 control-label np">手机号码：</label>
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<input id="phone" name="phone" minlength="11" maxlength="11" type="text" class="form-control" required="" aria-required="true" placeholder="请输入手机号码(必填)" />
		    				</div>
	    				</div>
					</td>
				    <td width="50%" align="right">
				    	<label class="col-sm-3 control-label np">账号类型：</label>
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<select id="accountType" name="accountType"  class="select-control">
								</select>
		    				</div>
	    				</div>
					</td>
				</tr>
				<tr>
				    <td width="50%" align="right">
				    	<label class="col-sm-3 control-label np">邮箱地址：</label>
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<input id="mailbox" name="mailbox" minlength="2" maxlength="20" type="email" class="form-control"  aria-required="true" placeholder="请输入邮箱地址" />
		    				</div>
	    				</div>
					</td>
				    <td width="50%" align="right">
				    	<label class="col-sm-3 control-label np">行政机构：</label>
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<input id="orgId" name="orgId"  type="hidden" />
		    					<input id="orgName" name="orgName"  type="text" class="form-control smalliconcur smallicon" readonly="readonly" required="required" placeholder="请选择行政机构(必填)" onclick="companyCho()"/>
		    				</div>
	    				</div>
					</td>
				</tr>
				<tr>
					<td width="50%" align="right"  class="glywy">
				    	<label class="col-sm-3 control-label np">关联业务员：</label>
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<input id="salersmanId" name="salersmanId" type="hidden"/>
		    					<input id="salersmanCode" name="salersmanCode" type="hidden"/>
		    					<input id="salersmanName" name="salersmanName" type="text" class="form-control smalliconcur smallicon" readonly="readonly" required="required" placeholder="请选择关联业务员(必填)"  onclick="gLywyCho()"/>
		    				</div>
	    				</div>
					</td>
				    
				    <td width="50%" align="right" valign="top">
				    	<label class="col-sm-3 control-label np">备注：</label>
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<textarea id="remarks" name="remarks" cols="20" rows="1" type="text" class="textarea-control" aria-required="true" placeholder="请输入备注" ></textarea>
		    				</div>
	    				</div>
					</td>
				</tr>
				 <tr>
					<td width="50%" align="right" >
						<input id="busiId" name="busiId" type="hidden" value="" /> 
						<input id="customerId" name="customerId" type="hidden" value="sys_user" /> 
	    				<label class="col-sm-3 control-label np">用户头像：</label>
		    			<div class="form-group">
		    				<div class="col-sm-8">
		    					<div class="zx-addimg">
		    					<ul id="YONG_HU_TOU_XIANG">
						        	<li style="margin:0">
										<img filelabel="${attachmentLabelNames.YONG_HU_TOU_XIANG }"
										src="${basePath}/img/shangchuanzhaopian.png" width="110px" height="110px" class="zx-imgPre ${attachmentLabelNames.YONG_HU_TOU_XIANG }">
										<span filelabelDelSpan="${attachmentLabelNames.YONG_HU_TOU_XIANG }" class="hidden bt-cancle glyphicon glyphicon-trash" onclick="deleleFileRecord(this,'${attachmentLabelNameValues.YONG_HU_TOU_XIANG }',false);"></span>
										<div class="img-layer">
											<div></div>
											<span filelabelLabelSpan="${attachmentLabelNames.YONG_HU_TOU_XIANG }">${attachmentLabelNameValues.YONG_HU_TOU_XIANG }</span>
										</div>
										<a href="javascript:void(0);" class="file">
											<span>上传资料</span> 
											<input type="file" accept="image/gif,image/jpeg,image/bmp,image/png,image/jpg" onchange="uploadFile(this,'${modeIDTypeNames.YONGHUGUANLI }','YONG_HU_TOU_XIANG', false, false);" />
										</a>
									</li>
								</ul>
								</div>
		    				</div>		    				
		    				<input type="hidden" id="headerImage" name="headerImage"/>
    					</div>
					</td>
					 <td width="50%" align="right" valign="top">&nbsp;</td>
				</tr>
			</table>
			<table cellpadding="0" cellspacing="0" border="0" bordercolor="#3B95C8"  width="100%">
				<tr>
					<td width="100%" align="center">
						 <div class="ibox-content">
				              <button type="button" class="btn dpbtn_green" onclick="Updatesave();">确定</button>
				              <button type="button" class="btn dpbtn_red" onclick="Reset();">重置</button>
				          </div>
					</td>
				</tr>
			</table>
		</form>
	</div>
	
	<div id="loanBankCho" style="display: none;">
		<div class="business-padding">
			<ul id="loanBankChoul"></ul>
			<div class="div-fixed">
				<table cellpadding="0" cellspacing="0" border="0" bordercolor="#3B95C8"  width="100%">
					<tr>
						<td width="100%" align="center">
							 <div class="ibox-content">
					              <button type="button" class="btn dpbtn_green" onclick="loanBankSave();">确定</button>
					              <button type="button" class="btn dpbtn_red" onclick="loanBankCancel();">取消</button>
					          </div>
						</td>
					</tr>
				</table>
			</div>
		</div>	
	</div>
	
	<!-- public quote -->
    <%@include file="/jsp/comm_js_include.jsp"%>
      <!-- 文件上传 -->
    <%@include file="/jsp/common_fileupload_include.jsp"%>

 	<!-- custom js -->
    
    <script type="text/javascript" src="${basePath}/js/commonvalidate.js" charset="utf-8"></script>
    
    <!--zTreeStyle.js-->
	<script type="text/javascript" src="${basePath}/js/zTreeStyle/jquery.ztree.core.js" charset="utf-8"></script>
	<script type="text/javascript" src="${basePath}/js/zTreeStyle/jquery.ztree.excheck.js" charset="utf-8"></script>
    
    <!--
    	作者：zhangpp
    	时间：2017-04-06
    	描述：js
    -->
    <script type="text/javascript">
  	//关联业务员判断
  		$(function(){
	  		accountTypeData();
	  		
	  		$("#accountType").change(function(){
	  		  var accountTypeval = $("#accountType").val();
	  		  if(accountTypeval =="0"){
	  			  $(".glywy").show();
	  			  $("#salersmanName").attr("required","required");
	  	          $("#salersmanName").attr("placeholder","请选择关联业务员(必填)");
	  		  }else if(accountTypeval =="1"){
	         	 $(".glywy").hide();
	        	 $("#salersmanName").val("");
	        	 $("#salersmanId").val("");
	        	 $("#salersmanCode").val("");
	          }else if(accountTypeval =="2"){
	        	 $(".glywy").show();
	        	 $("#salersmanName").val("");
	        	 $("#salersmanId").val("");
	        	 $("#salersmanCode").val("");
	        	 $("#salersmanName").removeAttr("required","required");
	        	 $("#salersmanName").attr("placeholder","请选择关联业务员");
	        	 
	          }
	       })	
	  	})
		  	
	  	 function accountTypeData(){
	  	  $.dpAjax({
	  			show:false,
	  	    	url:'${basePath}/DataDictionaryController/getEnableList',
	   			data:{"parentValue":"AccountType"},
	   			success: function(datas){
	   			  var result = datas.result.rows;
					  var html="";
				      for(var i=0;i<result.length;i++){
				          var programme = result[i];
				          html += '<option value="'+programme.value+'">'+programme.name+'</option>';
				      }
				      $("#accountType").html(html);
	             }
	  	   });
	    } 
   
  		var glywyLayer;
     	  
     	function gLywyCho(){
      	    var accountType = $("#accountType").val();
      	    var salersmanId = $("#salersmanId").val();
      	  	$.dpAjax({
      	  		show:false,
      			url:'${basePath}/BaseAccountBusiUnitController/mulitList',
      			data:{salersmanId:salersmanId,accountType : accountType, scene:1, relSalersman : 1},
     				success: function(datas){
     				var content = '<div class="ibox-content" style="height: 380px;border: 1px solid #F5F5F6; overflow:auto;overflow-x: hidden;">'
  					+ '	<div id="orgtreeDemo" class="ztree">&nbsp;</div>'
  					+ '</div>'
  					+ '<div class="ibox-content">'
  					+ '<button class="btn dpbtn_green" type="button" onclick="confirmOrg();">确定</button>&nbsp;'
  					+ '<button class="btn dpbtn_red" type="button" onclick="cancelOrg();">取消</button>'
  					+ '</div>';
  		
  		    	glywyLayer = layer.open({
  			    	  title:'分配关联业务员',
  			    	  type: 1,
  			    	  area: ['600px', '500px'], //宽高
  			    	  content: content
  			    });
  		    	
  			    var setting = {
  						check: {
  							enable: true
  						},
  						data: {
  							simpleData: {
  								enable: true
  							},
  						},
  						callback: {
  							onNodeCreated: zTreeOnNodeCreated
  						}
  			    };			
  			  var  arr = [];
  			  var d = datas.result.rows;
  			  for(var i in d)
  			  {  
  				  var r = d[i];
  				  var objs = {};
  				  objs.replaceId = r.replaceId;
  				  objs.id = r.orgCode;
  				  objs.pId = r.parentCode;
  				  objs.name = r.orgName;
          		  objs.open = r.open;
          		  if(r.parentCode == '0'){
         		  	 	 objs.open = true;
   				  }
  				  objs.checked = r.checked;
          		  objs.salersman=r.salersman;
  				  if(!objs.salersman) {
  				  	objs.nocheck = true;
  				  }
  				  arr.push(objs);
  			  }
  			    zTrees_ = $.fn.zTree.init($("#orgtreeDemo"), setting, arr);
  		 		
  			    zTrees_.setting.check.chkboxType={"Y": "", "N": "ps"};		
  				
  			    return;
     			 }
  	       });
     }
    
 	 function cancelOrg(){
  		  layer.close(glywyLayer);
  	  }
  	   
 	  
    
	  function zTreeOnNodeCreated(event, treeId, treeNode) {
		if(treeNode.salersman==true){
			$('#'+treeNode.tId+'_ico').css("background", "url('../img/header.png') center center/15px 15px no-repeat");
		}
	  }
 	  
	  
	  var confirmOrg = function()
	    {
	        var accountType = $("#accountType").val();
	      	if(accountType == 1){
	      		layer.msg("内勤不能关联业务员", {icon: 5});
	      		return;
	      	}
	      	
			var treeObj = $.fn.zTree.getZTreeObj("orgtreeDemo");
			var nodes = treeObj.getCheckedNodes();
			var treeNode = nodes[0];
	        var length = nodes.length;
	        if(length == 0) {
	        	$("#salersmanId").val('');
		        $("#salersmanCode").val('');
		        $('#salersmanName').val('');
		        layer.closeAll();
		        return;
	        }
	        
	        if(length != 1) {
	        	layer.msg('请选择一个业务员节点',{icon:7});
	        	return;
	        }
	        
			if(!nodes[0].salersman){
				layer.msg("只能选择业务员节点", {icon: 5});
       		 return;
	        }
			var idUnit = nodes[0].replaceId;
			var codeUnit = nodes[0].id;
	       
	        $("#salersmanId").val(idUnit);
	        $("#salersmanCode").val(codeUnit);
	        $('#salersmanName').val(treeNode.name);
	        layer.closeAll();
	    }
    
    
    	function companyCho(){
		  $.dpAjax({
			    show:false,
			    url:'${basePath}/BaseOrganizationController/list',
	  			data:{},
	  			success: function(datas){
   				  var content = '<div class="ibox-content" style="height: 230px;border: 1px solid #F5F5F6; overflow:auto;overflow-x: hidden;">'
    					+ '	<div id="treeDemo" class="ztree">&nbsp;</div>'
    				+ '</div>'
    				+ '<div class="ibox-content">'
    				+ '	 <button class="btn dpbtn_green" type="button" onclick="confirmRole();">确定</button>'
    				+ '	 <button class="btn dpbtn_red" type="button" onclick="cancelRole();">取消</button>'
    				+ '</div>';
    		
			    	index = layer.open({
				    	  title:'行政机构',
				    	  type: 1,
				    	  area: ['300px', '350px'], //宽高
				    	  content: content
				    });
			    	var setting = {
		 					check: {
		 						enable: false
		 					},
		 					data: {
		 						simpleData: {
		 							enable: true
		 						}
		 					}
		 			};			
			    	var  arr = [];
   				    var d = datas.result.rows;
   				    for(var i=0;i<d.length;i++)
   				    {  
   					  var r = d[i];
   					  var objs = {};
   					  objs.id = r.replaceId;
   					  objs.name = r.orgName;
   					  objs.pId = r.parentId;
   					  objs.provinceId = r.provinceId;
   					  objs.areaId = r.areaId;
            		  objs.open = true;
   					  arr.push(objs);
   				    }
   				  	$.fn.zTree.init($("#treeDemo"), setting, arr);
            	}
	    	});	
		}	
		
	   var confirmRole = function()
	    {
	    	 var zTree = $.fn.zTree.getZTreeObj("treeDemo"); 
	    	 var node=zTree.getSelectedNodes();
	    	 var treeNode = node[0];
	    	 if(treeNode.isParent){
	    		 layer.msg("父节点不可选择！", {icon: 5});
	    		 return;
	    	 }
	    	 
	    	 var parentNode = treeNode.getParentNode();
	    	 if(!parentNode) {
	    		 layer.msg("只能选择行政机构!", {icon: 5});
	    		 return;
	    	 }
	    	 document.getElementById('orgId').value=treeNode.id;
	    	 document.getElementById('orgName').value=treeNode.name;
	    	 layer.closeAll(); 
	    }
		
	    var cancelRole = function()
	    {
		   layer.closeAll(); 
	    }
	    
	    var loanBankCholayer;
	      function loanBankCho(){
	    	   loanBankCholayer = layer.open({
		    	  title:'贷款银行',
		    	  type: 1,
		    	  area: ['400px', '350px'], //宽高
		    	  content: $("#loanBankCho")
		    	});
	      }
	      
	      /**
	       * 取消
	       */
	      function loanBankCancel(){
	    	  layer.close(loanBankCholayer);
	      }
	    
	      function loanBankSave(){
	    	 var $loanBankCheckBox = $(".loanBankCheckBox:checked");
	    	 var values = '';
	    	 var names = '';
	    	 var length = $loanBankCheckBox.length;
	    	 for(var i = 0; i < length; i++) {
	    		 values += '|' + $loanBankCheckBox[i].value + '|';
	    		 names += $loanBankCheckBox[i].name;
	    		 if(i != length - 1) {
	    			 names += ',';
	    		 }
		 	 }	
	    	 $('#loanBank').val(values);
	    	 $('#loanBankName').val(names);
	    	 layer.close(loanBankCholayer);
	      }
	   
   		$(function(){
   			$("#changehead").click(function(){
   				$(".headupload").show();
   			});
   			
   			/* 贷款银行 */
	   		 $.dpAjax({
	   	    		url:'${basePath}/DataDictionaryController/getEnableList',
	    			data:{"parentValue":"LoanBank"},
	    			success: function(datas){
	    			  var result = datas.result.rows;
	 				  var arr=[];
	 			      for(var i=0;i<result.length;i++){
	 			          var programme = result[i];
	 			          arr.push('<li><label><input class="loanBankCheckBox" type="checkbox" value="'+programme.value+'" name="'+programme.name+'"/>'+programme.name+'</label></li>')
	 			      }
	 			      $("#loanBankChoul").html(arr);
	 			      
	 			     getUserById();
	              }
	   	     });
   			// 验证
   	        $("#commentForm").validate({
   	            rules: {
   	                uname:{chinese: true},
   	                phone:{mobile: true}
   	            },
   	            //重写showErrors
   	            showErrors: function (errorMap, errorList) {
   	                $.each(errorList, function (i, v) {
   	                    layer.tips(v.message, v.element, { time: 1500 });
   	                    return false;
   	                });  
   	            },
   	            /* 失去焦点时验证 */
   	            onfocusout: function(element) { $(element).valid(); },
   	            /*  键盘抬起不验证 */
   	            onkeyup:false
   	        });

   		});
   		
   		function getUserById(){
   			var id = $.getUrlData('uid'); 
   			$.dpAjax({
   				show:false,
 	    		url:'${basePath}/user/getById',
     			data:{"id":id},
     			success: function(datas){
   				   var result = datas.result;
     			   showAttentment(result.replaceId, null, '${modeIDTypeNames.YONGHUGUANLI }');
   				   $('#id').val(result.replaceId);
   				   var loanBank = result.loanBank;
     			   $('#loanBank').val(result.loanBank);
     			   $('#loanBankName').val(result.loanBankName);
     			   $('#loginName').val(result.loginName);
     			   $('#uname').val(result.uname);
     			   $('#phone').val(result.phone);
     			   $('#mailbox').val(result.mailbox);
     			   $('#remarks').val(result.remarks);
     			   $('#headerImage').val(result.headerImage);
     			   $("#orgId").val(result.orgId);
     			   $("#orgName").val(result.orgName);
     			   $("#positionId").val(result.positionId);
     			   $('#busiId').val(result.replaceId);
     			   $('#accountType').val(result.accountType);
     			   
     			   $('#salersmanId').val(result.salersmanId);
     			   $('#salersmanCode').val(result.salersmanCode);
     			   $('#salersmanName').val(result.salersmanName);
     			   
     			   $('.loanBankCheckBox').each(function(index){
     				   var bankCode = $(this).val().trim();
     				   if(loanBank.indexOf('|' + bankCode + '|') >= 0){
     					   $(this).attr('checked','checked');
     				   }
     			   });
     			   
     			   var accountTypeval = result.accountType;
    		  	   if(accountTypeval =="0"){
    					  $(".glywy").show();
    					  $("#salersmanName").attr("required","required");
    			          $("#salersmanName").attr("placeholder","请选择关联业务员(必填)");
    				}else if(accountTypeval =="1"){
    		      	  	$(".glywy").hide();
    		        }else if(accountTypeval =="2"){
    			      	 $(".glywy").show();
    			      	 $("#salersmanName").removeAttr("required","required");
    			      	 $("#salersmanName").attr("placeholder","请选择关联业务员");
    		        } 
                 }
 	    	});
   		}
   		
   		//重置
   		var Reset = function(){
			document.getElementById('phone').value = "";
			document.getElementById('mailbox').value = "";
			document.getElementById('orgId').value = "";
			document.getElementById('orgName').value = "";
			document.getElementById('positionId').value = "";
			document.getElementById('remarks').value = "";
			document.getElementById('loanBankName').value = "";
		}

   	    var Updatesave = function(){
   			var validstatus = $("#commentForm").valid();

   	    	if(validstatus) {
   	    		var data = $('#commentForm').serialize();
   	    		data.id=id;
   	    		layer.confirm('您确认要修改吗？', {
   		  			  btn: ['确定','取消'] //按钮
   				},function(){
   					layer.closeAll();
   					$.dpAjax({
       	 	    		url:'${basePath}/user/modify',
       	     			data:data,
       	     			success: function(datas){
      	     				 layer.msg("修改成功！", {icon: 6});
      	     				 parent.layer.close(parent.updateLayer);
       	                 }
       	 	    	});
   					   					
   				});
   	    	}
   		} 
    </script>
</body>
</html>
